<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
    <head>  
        <title>Framework 2.0 Demo</title>
    </head>
    <body>
<wicket:panel>
	<p>
			asdsadsadsa dsad sadsa d sadsadsa dsadsad
			a sdasdsad
	</p>
	<p>
			asdsadsadsa dsad sadsa d sadsadsa dsadsad
			a sdasdsad
	</p>
	<div style="width: 100%; padding-top: 50px;">	
		<table cellpadding="0" cellspacing="1">
			<tbody>
				<tr>
					<td>
						<div wicket:id="tooltip" class="ui-widget ui-widget-content ui-corner-all" style="width: 200px; padding: 5px; font-size: 10px;">
						   Show a tooltip!.
						</div>			
						<div class="blackarrow">
							<div style="padding: 20px; color: white;">
								This is a tooltip.
							</div>
						</div>				
					</td>
					<td>
						<div wicket:id="tooltip2" class="ui-widget ui-widget-content ui-corner-all" style="width: 200px; padding: 5px; font-size: 10px;">
						   Show a tooltip! <span id="position"></span>
						</div>
						<div style="display: none; width: 208px; font-size: 10px; padding-top: 0px; padding-left: 0px; padding-bottom: 2px; padding-right: 1px;" class="ui-widget-shadow">
							<div style="width: 196px; font-size: 10px; padding: 5px; margin-left: -1px; margin-top: -1px;" class="ui-widget ui-state-default ui-corner-all">
									This is a tooltip.	
							</div>
						</div>
					</td>
				</tr>
			</tbody>
		</table>		
		<p wicket:id="tooltip0" style="width: 200px" title="Bla Bla!">
			asdsadsadsa dsad sadsa d sadsadsa dsadsad
			a sdasdsad
		</p>
		<div wicket:id="withAjax" class="ui-content ui-state-default" style="width: 150px; height: 150px;">
			With AJAX
		</div>
		<div class="blackarrowbig">
			<div style="padding: 20px; margin: auto; color: white; font-weight: bold;">
				Updated with AJAX! <span wicket:id="times"></span>
			</div>
		</div>
	</div>
</wicket:panel>
    </body>
</html>
